<template>
	<div>
		<!--存储内容 列表-->
		
		<el-row style="margin:30px 20px -20px;">
			<el-col :span="12">
				路径 ：/{{path.join("/")}}
			</el-col>
			<el-col :span="12" class="list-over-btns" align="right">
				<el-button v-show="path.length" @click="goBackFile">
					<i class="iconfont icon-fanhui"></i>
					返回上一级
				</el-button>
				
				<el-button v-if="id==1" @click="addFile">
					<i class="iconfont icon-folder-add"></i>
					新建文件夹
				</el-button>
				
				<uploadBtn v-if="id==1" :options="{}" @success="uploadSuccess"></uploadBtn>
				
			</el-col>
		</el-row>
		
		<listTable
			v-loading="loading"
			ref="listTable"
			v-if="listOption" 
			:options="listOption"
			@command="listCommand"
			></listTable>
			
	</div>
</template>

<script>

import listTable from "@/view/components/table/listTable";
import uploadBtn from "@/view/components/upload/uploadBtn";
import { apiUrls, getFileFirstList , getFileDetailList , removeFile ,createFile } from "@/service/swagger/ShareController"


export default {
	props: [
		"id" , // storeId
	],
	components: {
		listTable,
		uploadBtn,
	},
	data() {
		return {
			path : [],
			parentIds : [],
			loading:false,
			
			listOption: {
				noPage: true,
				listData : [],
				// 表头设置
				header: [{
					label: "文件名",
					propName: "fileName",
					width:"300",
					align: "left",
					commandName: "goDetail",
					html:(row)=>{
						if(row.fileType==1){
							return `<span><img style="vertical-align: middle;margin-right:10px;" src="/static/img/file/file.png" />${row.fileName}</span>` ;
						}else{
							return `<span><img style="vertical-align: middle;margin-right:10px;" src="/static/img/file/txt.png" />${row.fileName}</span>` ;
						}
					}
				},{
					label: "创建人",
					propName: "creator",
				},{
					label: "创建时间",
					propName: "createTime",
				},{
					label: "文件类型",
					html:(row)=>{
						return {
							1 : "文件夹",
							2 : "文件"
						}[row.fileType]
					},
				},{
					label: "文件大小",
					html:(row)=>{
						if(row.fileType!=1){
							return row.size
						}
					},
				},{
					label: "操作",
					width: "120",
					btns: [{
						label: "详情",
						show:(row)=>{
							return row.fileType == 1
						},
						commandName: "goDetail",
					},{
						label: "删除",
						commandName: "deleteZJ",
						show:(row) => {
							return row.storeId == 1
						}
					},],
					btnGroups: []
				}]
			}
		}
	},
	mounted() {
		this.initData();
	},
	methods: {
		listCommand(command, row, index) {
			if (command && this[command]) {
				this[command](row, index);
			}
		},
		initData(){
			this.loading=true;
			getFileFirstList({
				id : this.id
			}).then(ret=>{
				if(!ret.code){
					this.$refs.listTable.serviceCallBack({
						data : ret.data.files
					})
					this.loading=false;
				}
			})
			
		},
		
		goDetail(row,index){
			console.log("打开文件夹：",row,index)
			if(row.fileType!=1){
				return ;
			}
			this.path.push(row.fileName);
			this.parentIds.push(row.id);
			this.getFileDetail({
				id: row.id,
				path: "/" +  this.path.join("/"),
				storeId: this.id,
				type: 1  // 1 内部内容 ， 2 上级内容
			},1)
		},
		
		goBackFile(){
			let params = {
				id: this.parentIds[this.parentIds.length-1],
				path: "/" +  this.path.join("/"),
				storeId: this.id,
				type: 2  // 1 内部内容 ， 2 上级内容
			}
			this.path.pop();
			this.parentIds.pop();
			this.getFileDetail(params)
		},
		
		getFileDetail(params){
			this.loading=true;
			getFileDetailList(params).then(ret=>{
				this.$refs.listTable.serviceCallBack({
					data : ret.data.files
				})
				this.loading=false;
			})
		},
		
		refresh(){
			if(this.parentIds&&this.parentIds.length){
				this.getFileDetail({
					id: this.parentIds[this.parentIds.length-1],
					path: "/" +  this.path.join("/"),
					storeId: this.id,
					type: 1 
				})
			}else{
				this.initData();
			}
		},
		
		addFile(){
			this.$emit("command","openAddFile",{
				filePath : "/" +  this.path.join("/"),
				parentId : this.parentIds[this.parentIds.length-1],
			})
		},
		
		deleteZJ(row,index){
			this.$confirm('删除操作无法恢复，请确定是否删除该文件夹？', "删除文件夹", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
      	removeFile({
      		id : row.id ,
      		path : "/" +  this.path.join("/") + "/" + row.fileName,
      		storeId: this.id,
      	}).then(ret=>{
      		this.refresh();
      	})
      });
		},
		
		uploadSuccess(name,{res,file}){
			let params = {
				fileName: file.name,
				filePath: res.data,
				fileType: "2",
				parentId: this.parentIds[this.parentIds.length-1],
				storeId: this.id,
			}
			createFile(params).then(ret=>{
				if(!ret.code){
					this.$message({
						message:'上传文件成功!',
						type:'success',
						
					})
					this.refresh()
				}
			})
		},

	}

}
</script>

<style>
</style>